<!--_meta 作为公共模版分离出去-->
<!DOCTYPE HTML>
<html>
<head>
    {include file="common/head" /}
</head>
<body>
{include file="common/menuLeft" /}
<section class="Hui-admin-article-wrapper">
    {include file="common/menuTop" /}
    <div class="Hui-admin-article">
        <nav class="breadcrumb" style="background-color:#fff;padding: 0 24px">
            首页
            <span class="c-gray en">/</span>
            添加采购单
        </nav>
        <article class="Hui-admin-content clearfix">
            <div class="panel">
                <div class="panel-body">
                    <div class="row clearfix">
                        <div class="col-xs-12 col-sm-6 col-md-4">
                            <div class="row clearfix mb-10">
                                <span class="col-xs-4 form-item-label">制单人：</span>
                                <span class="col-xs-8 form-item-control">
										<input type="text"  value="{$add_user}" name="add_admin" id="add_admin" placeholder=" {$add_user}" class="input-text" disabled/>
									</span>
                            </div>
                        </div>
                        <div class="col-xs-12 col-sm-6 col-md-4">
                            <div class="row clearfix mb-10">
                                <span class="col-xs-4 form-item-label">制单日期：</span>
                                <span class="col-xs-8 form-item-control">
										<input type="text" name="add_purchase_date" id="add_purchase_date" class="input-text datetimepicker-input" placeholder=" 制单日期" autocomplete="off"/>
									</span>
                            </div>
                        </div>
                        <div class="col-xs-12 col-sm-6 col-md-4">
                            <div class="row clearfix mb-10">
                                <span class="col-xs-4 form-item-label">单据编号：</span>
                                <span class="col-xs-8 form-item-control">
										<input type="text" value="{$purchase_sn}" name="purchase_sn" id="purchase_sn" placeholder=" " class="input-text" disabled/>
									</span>
                            </div>
                        </div>


                        <div class="col-xs-12 col-sm-6 col-md-4">
                            <div class="row clearfix mb-10">
                                <span class="col-xs-4 form-item-label">备注：</span>
                                <span class="col-xs-8 form-item-control">
										<input type="text" name="purchase_note" id="purchase_note" placeholder=" 备注" class="input-text" />
									</span>
                            </div>
                        </div>

                        <div class="col-xs-12 col-sm-6 col-md-4">
                            <div class="row clearfix mb-10">
                                <span class="col-xs-4 form-item-label">采购单状态：</span>
                                <span class="col-xs-8 form-item-control">
										<span class="select-box">
                                            <select class="select" name="state" size="1" id="state">
                                                <option value="-1">请选择采购单状态</option>
                                                <option value="1">未完结</option>
                                                <option value="2">已完结</option>
                                            </select>
                                        </span>
									</span>
                            </div>
                        </div>

                        <div class="col-xs-12 col-sm-6 col-md-4">
                            <div class="row clearfix mb-10">
                                <button type="button" class="btn btn-success radius" id="add_purchase" name="" ><i class="Hui-iconfont" >&#xe632;</i> 新建采购单</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="panel mt-20">
                <div class="panel-body" 发布="">
                    <div class="clearfix">
							<span class="f-l" style="width: 600px;">
                                <div class="row clearfix">
                                    <div class="col-xs-12 col-sm-12 col-md-6">
                                        <input placeholder="商品名称" type="text" class="input-text f-l" id="keywords" name="keywords" autocomplete="off">
                                    </div>
                                    <div class="col-xs-12 col-sm-6 col-md-6">
<!--                                        <button class="btn btn-secondary radius"><i class="Hui-iconfont">&#xe709;</i>搜索</button>-->
<!--                                        <a href="javascript:;" onclick="datadel()" class="btn btn-danger radius"><i class="Hui-iconfont"></i> 批量删除</a>-->
<!--								        <a href="javascript:;" onclick="datadel()" class="btn btn-success radius"><i class="Hui-iconfont"></i> 确认到货</a>-->

                                    </div>
                                </div>
							</span>
                        <span class="f-r l-30">采购商品：<strong id="all_total_goods">0</strong> 个，采购总数：<strong id="all_total_goods_number">0</strong> 个，采购金额：<strong id="all_total_price">0</strong> 元</span>
                    </div>

                    <div class="clearfix mt-10">
							<span class="f-l">

							</span>
                    </div>

                    <div class="clearfix mt-10">

                        <table class="table table-border table-bordered table-hover table-bg table-sort" id="goods_list">
                            <thead>
                            <tr class="text-c">
                                <th>商品名称</th>
                                <th width="110">货号</th>
                                <th width="160">条形码</th>
                                <th width="80">库存</th>
                                <th width="80">进货数量</th>
                                <th width="80">进货成本</th>
                                <th width="80">操作</th>
                            </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>

                    <div id="laypage" class="text-c"></div>
                </div>
            </div>
        </article>
    </div>
</section>

{include file="common/footer" /}

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="__ROOT__/lib/datatables/1.10.15/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="__ROOT__/lib/laypage/1.2/laypage.js"></script>
<script type="text/javascript" src="__ROOT__/static/business/js/main.js"></script>
<!--/请在上方写此页面业务相关的脚本-->
<script>
    //获取商品列表
    function get_goodslist () {
        var goods_list = {}
        var goods_number = $('#goods_list tbody tr').size()
        $('#goods_list .goods_id').each(function(index){
            goods_id = $(this).val()
            goods_number = $('#need_'+goods_id).val();
            price = parseFloat($('#price_'+goods_id).val());
            goods_list[goods_id] = {'goods_number':goods_number,'price':price};
        })
        return goods_list;
    }
    //统计数量
    function count_goods_data () {
        var goods_number = $('#goods_list tbody tr').size()
        var all_total_goods = 0;
        var all_total_goods_number = 0;
        var all_total_price = 0;
        $('#goods_list .goods_id').each(function(index){
            goods_id = $(this).val()
            all_total_goods=all_total_goods+1;
            all_total_goods_number =  all_total_goods_number + parseInt($('#need_'+goods_id).val())
            all_total_price = all_total_price + parseFloat($('#need_'+goods_id).val()) * parseFloat($('#price_'+goods_id).val())
        })
        $('#all_total_goods').text(all_total_goods)
        $('#all_total_goods_number').text(all_total_goods_number)
        $('#all_total_price').text(all_total_price)
    }

    $('#goods_list').on( "change",'input', function(){
        count_goods_data();
    })

    $(function(){
        var select_goods_id = [];
        $('#add_purchase').click(function(){
            var purchase = {};
            var goods_list = get_goodslist();
            purchase.purchase_sn = $('#purchase_sn').val();
            purchase.add_purchase_date = $('#add_purchase_date').val();
            purchase.purchase_note = $('#purchase_note').val();
            purchase.state = $('#state').val();
            if(!purchase.add_purchase_date){
                layer.msg('制单日期为必填项');
                return false;
            }
            if(purchase.state <= 0){
                layer.msg('请选择采购单状态');
                return false;
            }
            $.ajax({
                url:"{:url('purchase/manual_add_purchase')}",
                type:'POST', //GET
                async:true,    //或false,是否异步
                data:{
                    goods_list: JSON.stringify(goods_list),
                    purchase: JSON.stringify(purchase)
                },
                timeout:5000,
                dataType:'json',
                success:function(data,textStatus,jqXHR){
                    if(data.code<=0){
                        layer.msg(data.msg)
                    }else{
                        layer.alert(data.msg, function(index){
                            window.location.href="{:url('purchase/purchase_list')}"
                        });
                    }
                    console.log(data)
                },
                error:function(xhr,textStatus){
                    console.log('错误',xhr.responseText)
                }
            })
        })
        $("#add_purchase_date").datetimepicker({
            language:  'zh-cn',
            format: 'yyyy-mm-dd',
            minView: "month",
            todayBtn:  1,
            autoclose: 1
        })
        $('#keywords').keydown(function(e){
            if(e.keyCode==13){
                layer.closeAll()
                keywords = $(this).val()
                if(!keywords){
                    layer.msg('缺少关键词')
                    return false;
                }else {
                    $.ajax({
                        url: "{:url('goods/getList')}",
                        type: 'GET', //GET
                        async: true,    //或false,是否异步
                        data: {
                            goods_name: keywords,
                        },
                        timeout: 5000,    //超时时间
                        dataType: 'json',    //返回的数据格式：json/xml/html/script/jsonp/text
                        success: function (res_data, textStatus, jqXHR) {
                            if (res_data.data.result) {
                                var data = res_data.data.datas;
                            }
                            goods_html = "<ul class='searchui pd-20'>"
                            if (data.length > 0) {
                                for (var i = 0; i < data.length; i++) {
                                    goods_html += "<li class='clear'><span style='width: 90%;float: left' data-sn='"+data[i].goods_sn+"' data-code='"+data[i].goods_code+"' data-stock='"+0+"' data-id='"+data[i].goods_id+"' data-name='"+data[i].goods_name+"' class='goods_name'>"+data[i].goods_name+"</span> <button class='select_goods btn btn-success radius size-S f-r'>选择</button></li>"
                                }
                                count_goods_data()
                            }else{
                                goods_html += "<li class='text-c'>无结果</li>";
                            }
                            goods_html = goods_html + '</ul>'
                            count_goods_data()
                            layer.open({
                                type: 1,
                                title: '搜索结果',
                                shadeClose: true,
                                //skin: 'layui-layer-rim', //加上边框
                                area: ['620px', '540px'], //宽高
                                success: function (layero, index) {
                                    console.log(select_goods_id)
                                    $('.searchui .select_goods').click(function () {
                                        goods_name = $(this).siblings('span').data('name');
                                        goods_sn = $(this).siblings('span').data('sn');
                                        goods_id = $(this).siblings('span').data('id');
                                        goods_code = $(this).siblings('span').data('code');
                                        goods_stock = $(this).siblings('span').data('stock');
                                        goods_ok = $.inArray(goods_id,select_goods_id)
                                        if(goods_ok >= 0){
                                            layer.msg('采购单中已存在商品，请从新选择。');
                                        }else{
                                            goods_data = '<tr class="text-c"><td class="va-c text-l">'+goods_name+'</td> <td>'+goods_sn+'</td> <td class="va-c">'+goods_code+'</td> <td> '+goods_stock+' </td> <td> <input min=0 type="number" class="input-text text-c" value="0" id="need_'+goods_id+'"> </td> <input class="goods_id" type="hidden" value="'+goods_id+'" id="goods_id_'+goods_id+'"> <td> <input type="text" class="input-text text-c" value="0" id="price_'+goods_id+'"> </td> <td class="td-manage"><a class="size-S btn btn-danger radius" title="删除" href="javascript:;" onclick="member_del(this,\''+goods_id+'\')">删除</a> </td></tr>'
                                            $('#goods_list tbody').append(goods_data)
                                            select_goods_id.push(goods_id)
                                            layer.closeAll()
                                        }
                                        count_goods_data()
                                    })
                                },
                                content: goods_html
                            });

                            // console.log(goods_html);
                        },
                        error: function (xhr, textStatus) {
                            console.log('错误', xhr.responseText);
                            console.log(xhr);
                            console.log(textStatus);
                        }
                    })
                }
            }
        });
    });
</script>
</body>
</html>